<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>YC论坛</title>
<meta http-equiv="X-UA-Compatiable" content="IE=edge">
<link type="image/icon" rel="shortcut icon" href="images/yc.png"/>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/banse.css">
</head>
<body>
	<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
		<div class="container">
			<div class="navbar-header"> 
	            <a class="navbar-brand fontLogo" href="#"><img src="images/logo.png" height="50px"/></a>
	        </div>
	        <ul class="nav navbar-nav navbar-left">
	        	<li><a href="#">首页</a></li>
	        	<li><a href="#">动态</a></li>
	        	<li><a href="#">收藏</a></li>
	        </ul>
	        <form action="" class="navbar-form navbar-left">
	        	<div class="form-group">
	        		<input type="text" class="form-control" placeholder="Search">
	        		<button type="submit" class="btn btn-default">搜索</button>
	        	</div>
	        </form>
	        <ul class="nav navbar-nav navbar-right">
	        	<li><a href="#"><img src="images/user.png" id="userLoginPhoto" class="userP" /></a></li>
				<li><a href="#" id="currentloginUser">&nbsp;登录</a></li>
	        	<li id="addBlog"></li>
				<li><a href="#">注册</a></li>
	        </ul>
		</div>
	</nav>
	
	<div class="container main" id="index_blog_content">
		
	</div>
	<p id="showmore" onclick="showMoreArticle()">点击加载更多</p>
	
</body>
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript">
var page=1;
var rows=2;
$(function(){
	getData();
})

function getData(){
	$.post("blog",{op:"findByPage",page:page,rows:rows}, result=>{
		if(result.length < rows){//说明数据不够了
			$("#showmore").css("display","none");
		}
		var str="";
		$.each(result,function(index,item){
			str +='<div class="row"><div class="col-md-3 col-sm-5 col-xs-6"><div class="panel panel-default">';
			str +='<div class="panel-body"><div class="thumbnail"><img src="'+item.photo+'" alt="">';
			str +='</div><div class="caption"><h3>'+item.nickName+'</h3></div></div></div></div><div class="col-md-9 col-sm-7 col-xs-6">';
			str +='<div class="panel panel-success"><div class="panel-heading"><h4>';
			str +='<a href="detail.html?'+item.bid+'" target="_blank">['+item.tname+']'+item.title+'</a></h4></div>';
			str +='<div class="panel-body"><div class="content_a" style="height:138px;overflow:hidden"><h5 class="C_">';
			str +=item.content+'</h5></div></div><div class="btnAll"><ul class="nav nav_a">';
			str +='<li><span class="badge badge_a">'+item.bdate+'</span></li>';
			str +='<li><a href=""><span class="badge badge_a">'+item.coollect+'</span>&nbsp;收藏</a></li>';
			str +='<li><a href=""><span class="badge badge_a">'+item.support+'</span>&nbsp;推荐</a></li>';
			str +='<li><a href=""><span class="badge badge_b">'+item.oppose+'</span>&nbsp;反对</a></li></ul></div></div></div></div>';							
		})
		$("#index_blog_content").append($(str));
	},"json");
}
function showMoreArticle(){
	page=page+1;
	getData();
}
</script>
</html>